<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>打印电子面单</title>
		<style type="text/css">
			div#ctlDiv {height:750px;width:50%;float:left;border-style:solid;border-color:red;border-width:0px;}
			div#pdfDiv {height:750px;width:49%;float:left;border-style:solid;border-color:red;border-width:0px;}
		</style>	
		<script type="text/javascript">
			var socket;
			
			window.onload = function load()
			{
				document.getElementById("pdfDiv").style.visibility="hidden";
			}
			
			function setStatusLabel(msg)
			{
				var eStatus = document.getElementById("connectionStatus");
				eStatus.innerHTML = msg;
			}
			
			function doConnect(callback)
			{
				var serviceUrl = document.getElementById("serviceUrl").value;
			
				socket = new WebSocket(serviceUrl);
			
				// 监听消息
				socket.onmessage = function(event)
				{ 
					console.log('Client received a message',event); 
					document.getElementById("pdfDiv").style.visibility="hidden";
					// parse json
					var obj = eval('('+event.data+')');
					
					if (obj && (obj.previewURL || obj.previewImage))
					{
						var url;
						if (obj && obj.previewURL) {
							url = obj.previewURL;
						} else if (obj && obj.previewImage) {
							url = obj.previewImage;
						}
						var pdf = document.getElementById('pdf');
						if (pdf) {
							pdf.setAttribute('src', url);
							document.getElementById("pdfDiv").style.visibility="visible";
						}
					} 
					var resultElement = document.getElementById("resultMessage");
					resultElement.value = resultElement.value + event.data + "\n";
					resultElement.scrollTop = resultElement.scrollHeight;
				};
			
				socket.onopen = function(event)
				{
					if (callback != null) {
						callback();
					}
					setStatusLabel("已连接");
				}
			
				socket.onerror = function(error)
				{
					console.log("Failed to connect CN print at " + serviceUrl, error);
					setStatusLabel("连接错误");
				}
			
				// 监听Socket的关闭
				socket.onclose = function(event)
				{ 
					console.log('Client notified socket has closed',event);
					setStatusLabel("连接关闭");
				}; 
			}
			
			function sendCommand()
			{
				if (typeof socket == "undefined" || socket.readyState == WebSocket.CLOSED) {
					doConnect(sendCommand);
					return;
				}
			
				if (socket.readyState != WebSocket.OPEN) {
					alert("无效连接: " + socket.readyState);
					return;
				}
			
				var msg = document.getElementById('printmessage').value;
				var repeatCount = document.getElementById('repeatCount').value;
				var isPreview = document.getElementById('isPreview').checked;
				var time = new Date().getTime();
				
				for (var index = 0; index < repeatCount; index++) {
					var obj = JSON.parse(msg);
					
					if (obj["task"])
					{
						// taskID
						obj["task"]["taskID"] = time.toString() + "_TASK_" + index;
						
						// preview
						obj["task"]["preview"] = isPreview;
					}
					
					var newMsg = JSON.stringify(obj);
					socket.send(newMsg);
				}
			}
			
			function clearResult()
			{
				var resultElement = document.getElementById("resultMessage");
				resultElement.value = "";
			}
		</script>
	</head>
	<body>
		<div id="ctlDiv">
			<form name="formname" action="javascript:sendCommand()">
				<p>重复发送请求：<input id="repeatCount" type="number" min="1" max="1000" step="1" value="1" />&nbsp;&nbsp;&nbsp;
					<input id="isPreview" type="checkbox" checked="checked" />预览模式
				</p>
				<p>	服务器: <input type="text" id="serviceUrl" name="serviceUrl" value="ws://localhost:13528" />
				<label id="connectionStatus">已连接</label>
				<input type="submit" value="发送请求" /> 
				</p>
				<textarea cols="80" rows="20" id="printmessage" name="printmessage" style="display: none;">
					{
						"cmd": "print",
						"requestID": "123458976",
						"version": "1.0",
						"task": {
							"taskID": "7293666",
							"preview": false,
							"printer": "",
							"notifyMode": "allInOne",
							"previewType": "pdf",
							"documents": [
								{
									"documentID": "0123456789",
									"contents": [
										{
											"data": {
												"recipient": {
													"address": {
														"city": "玉林市",
														"detail": "南*街道银丰中药**栋***号",
														"district": "玉州区",
														"province": "广西壮族自治区",
														"town": ""
													},
													"mobile": "*******0111",
													"name": "唐**",
													"phone": "*******0111"
												},
												"routingInfo": {
													"consolidation": {
														"name": "",
														"code": ""
													},
													"origin": {
														"name": "",
														"code": ""
													},
													"sortation": {
														"name": ""
													},
													"routeCode": ""
												},
												"sender": {
													"address": {
														"city": "广州市",
														"detail": "南洲路119号华南致友创意园3楼308-3",
														"district": "海珠区",
														"province": "广东省",
														"town": ""
													},
													"mobile": "18665049985",
													"name": "李生",
													"phone": "18665049985"
												},
												"shippingOption": {
													"code": "COD",
													"services": {
														"SVC-COD": {
															"value": "200"
														},
														"TIMED-DELIVERY": {
															"value": "SEVERAL-DAYS"
														},
														"PAYMENT-TYPE": {
															"value": "ON-DELIVERY"
														},
														"SVC-INSURE": {
															"value": "1000000"
														},
														"SVC-PROMISE-DELIVERY": {
															"promise-type": "SAMEDAY_DELIVERY"
														}
													},
													"title": "代收货款"
												},
												"waybillCode": "78749730911224"
											},
											"signature": "19d6f7759487e556ddcdd3d499af087080403277b7deed1a951cc3d9a93c42a7e22ccba94ff609976c5d3ceb069b641f541bc9906098438d362cae002dfd823a8654b2b4f655e96317d7f60eef1372bb983a4e3174cc8d321668c49068071eaea873071ed683dd24810e51afc0bc925b7a2445fdbc2034cdffb12cb4719ca6b7",
											"templateURL": "http://newyitao.sc.kuaidi600.com/frx/send_zto.frx"
										}
									]
								}
							]
						}
					}
				</textarea>
				<br /><br />
				<textarea cols="80" rows="20" id="resultMessage" name="resultMessage" readonly="readonly" style="display: none;"></textarea>
				<br />
				<input type="button" value="清除返回消息" onclick="clearResult()" style="display: none;"/>
			</form>
		</div>

		<div id="pdfDiv" align="middle" style="visibility: visible;">
			<iframe id="pdf" src="" width="100%" height="100%">
			</iframe>
		</div>
	</body>
</html>